<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
	<meta charset="UTF-8">
	<meta name="viewport" content="width=device-width, initial-scale=1, minimum-scale=1, maximum-scale=1">
	<!--<link rel="stylesheet" type="text/css" href="/sh/css/notice.css" />-->
	<script type="text/javascript" src="/sh/js/plugin.js"></script>
	<link rel="stylesheet" type="text/css" href="/sh/css/swiper.min.css" />
	<script type="text/javascript" src="/sh/js/comm.js"></script>
	<script type="text/javascript" src="/sh/js/notice/notice.js"></script>
	<title>公告栏</title>
	<style>
		html, body {
			position: relative;
			height: 100%;
		}
		body {
			background: #eee;
			font-family: Helvetica Neue, Helvetica, Arial, sans-serif;
			font-size: 14px;
			color:#000;
			margin: 0;
			padding: 0;
		}
		.swiper-container {
			width: 100%;
			height: 100%;
			margin-left: auto;
			margin-right: auto;
		}
		.swiper-slide {
			text-align: center;
			font-family: 微软雅黑;
			background: #fff;
			margin:0 auto;

			/* Center slide text vertically */
			/*display: -webkit-box;
			display: -ms-flexbox;
			display: -webkit-flex;
			display: flex;*/
			-webkit-box-pack: center;
			-ms-flex-pack: center;
			-webkit-justify-content: center;
			justify-content: center;
			-webkit-box-align: center;
			-ms-flex-align: center;
			-webkit-align-items: center;
			align-items: center;
		}
		.swiper-slide-title {
			color: #00bbee;
			padding: 50px 0px 10px 0px;
			font-size: 16px;
			font-weight: bolder;
		}
		.swiper-slide-content{
			height: 200px;
			line-height: 23px;
			width: 350px;
			margin: 0 auto;
			text-align: center;
			max-height: 300px;
			color: #0E2D5F;
			font-size: 13px;
			overflow: hidden;
		}
		.swiper-slide-man {
			margin-top: 20px;
			text-align: right;
			padding-right: 230px;
		}
		.swiper-slide-time {
			text-align: right;
			padding-right: 205px;
		}
	</style>
</head>
<body>
	<div class="swiper-container">
		<div class="swiper-wrapper" id="notice_board">
			这是公告栏
			<!--<div class="swiper-slide">Slide 1</div>
			<div class="swiper-slide">Slide 2</div>
			<div class="swiper-slide">Slide 3</div>
			<div class="swiper-slide">Slide 4</div>
			<div class="swiper-slide">Slide 5</div>
			<div class="swiper-slide">Slide 6</div>
			<div class="swiper-slide">Slide 7</div>
			<div class="swiper-slide">Slide 8</div>
			<div class="swiper-slide">Slide 9</div>
			<div class="swiper-slide">Slide 10</div>-->
		</div>
		<!-- Add Pagination -->
		<div class="swiper-pagination"></div>
		<!-- Add Navigation -->
		<div class="swiper-button-prev"></div>
		<div class="swiper-button-next"></div>
	</div>
	<script type="text/javascript" src="/sh/js/swiper.min.js"></script>
	<!-- Initialize Swiper -->
	<!--<script>
        var swiper = new Swiper('.swiper-container', {
            observer:true,//修改swiper自己或子元素时，自动初始化swiper
            observeParents:false,//修改swiper的父元素时，自动初始化swiper
            slidesPerView: 3,
            centeredSlides: true,
            spaceBetween: 20,
            grabCursor: true,
            pagination: {
                el: '.swiper-pagination',
                clickable: true,
            },
			onSlideChangeEnd: function(swiper){
                swiper.update();
                mySwiper.startAutoplay();
                mySwiper.reLoop();
            }
        });
	</script>-->

    <script>
        var swiper = new Swiper('.swiper-container', {
            observer:true,//修改swiper自己或子元素时，自动初始化swiper
            observeParents:false,//修改swiper的父元素时，自动初始化swiper
            slidesPerView: 1,
            spaceBetween: 20,
            keyboard: {
                enabled: true,
            },
            pagination: {
                el: '.swiper-pagination',
                clickable: true,
            },
            navigation: {
                nextEl: '.swiper-button-next',
                prevEl: '.swiper-button-prev',
            },
        });
	</script>
</body>
</html>